$(function () {
    // alert('ok')
    // 定义一个模板引擎的过滤器函数
    template.defaults.imports.dataForm = function (dtStr) {
        var dt = new Date(dtStr)

        var y = dt.getFullYear()
        var m = dt.getMonth() + 1
        var d = dt.getDate()

        var hh = dt.getHours()
        var mm = dt.getMinutes()
        var ss = dt.getSeconds()

        // y = ling(y)
        m = ling(m)
        d = ling(d)
        hh = ling(hh)
        mm = ling(mm)
        ss = ling(ss)

        return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
    }
    // 补零
    function ling(n) {
        // 记得返回
        return n < 10 ? "0" + n : n
    }
    // 把一个变量，把参数保存到单独的对象中
    var q = {
        pagenum: 1,
        pagesize: 3,
        cate_id: '',
        state: ''
    }
    /* 效果一：获取文章数据，渲染到页面 */
    initTable()

    function initTable() {
        $.ajax({
            method: 'get',
            url: '/my/article/list',
            data: q,
            success(res) {
                // console.log(res);
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, {
                        icon: 5
                    })
                }
                // console.log(res);
                var htmlStr = template('tpl', res)
                // console.log(htmlStr);
                $('tbody').html(htmlStr)
                //渲染页码
                renderPage(res.total)
            }
        })
    }
    /*效果三： 分页功能 */
    function renderPage(total) {
        layui.laypage.render({
            elem: 'pageBox', //注意，这里的 test1 是 ID，不用加 # 号
            count: total, //数据总数，从服务端得到
            limit: q.pagesize, //每页显示的条数
            curr: q.pagenum, //当前获取第几页的数据

            layout: ['page', 'prev', 'next', 'count', 'limit'], //更换分页按钮的排版
            limits: [2, 4, 6, 8, 10],
            jump: function (obj, first) {

                // console.log(obj); obj 获取 配置项 对象
                // console.log(first); 渲染时是 true  点击是undefined

                // 为了防止死循环，所以渲染页面的时候不需要调用jump函数，不需要执行下面的代码
                if (first === true) {
                    return
                }
                // console.log(obj);
                q.pagesize = obj.limit
                q.pagenum = obj.curr //获取当前的页码，并赋值给q.pagenum
                // console.log(q.pagenum);
                // 在重新渲染页面
                initTable() // 因为jump回调函数不管是页面渲染还是点击都会调用这个函数，这样的话就会形成死循环
            }
        });

    }

    /* 效果二：筛选功能 */
    initCate()

    function initCate() {
        $.ajax({
            method: "get",
            url: "/my/article/cates",
            success(res) {
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, {
                        icon: 5
                    })
                }
                // console.log(res);
                // 渲染数据到模板结构
                var htmlStr = template('tpl-cate', res)
                $('select[name=cate_id]').html(htmlStr)
                // 手动渲染
                layui.form.render()
            }
        })
    }
    //筛选
    $("#form-search").on('submit', function (e) {
        e.preventDefault()
        // alert('ok')
        var cate_id = $('select[name=cate_id]').val()
        var state = $('select[name=state]').val()
        console.log(cate_id, state);
        q.cate_id = cate_id
        q.state = state
        // 获取文章数据，渲染到页面
        initTable()

    })


    /* 效果四：删除文章 */
    $('tbody').on('click', '.btn-del', function () {
        // 获取删除按钮的长度
        var len = $('.btn-del').length
        // console.log(len);
        var id = $(this).attr('data-id')
        // console.log(id);
        layer.confirm('您确定删除此文章吗?', {
            icon: 3,
            title: '提示'
        }, function (index) {
            //do something
            $.ajax({
                method: "get",
                url: '/my/article/delete/' + id,
                success(res) {
                    // console.log(res);
                    if (res.status !== 0) {
                        return layui.layer.msg(res.message, {
                            icon: 5
                        })
                    }
                    layui.layer.msg(res.message, {
                        icon: 6
                    })
                    // 判断按钮
                    if (len === 1) {
                        // 如果已经是1 ，不需要-1
                        q.pagenum = q.pagenum === 1 ? 1 : q.pagenum - 1
                    }
                    initTable()
                }
            })
            layer.close(index);
        });

    })

    /* 效果五：点击编辑 跳转页面，并且保存文章id */
    $('tbody').on('click', '.btn-ask', function () {
        var id = $('.btn-ask').attr('data-id')
        // console.log(id);
        localStorage.setItem('id', id)
        location.href = 'art_edit.html'
    })
   

})